<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/managemain' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>排课管理</el-breadcrumb-item>
      <el-breadcrumb-item>课程查看</el-breadcrumb-item>
    </el-breadcrumb>
    <el-card class="box-card">
      <div>
        <el-input placeholder="请输入用户id查询" v-model="searchvalue" class="input-with-select" clearable></el-input>
        <el-button slot="append" icon="el-icon-search" @click="searcheven"></el-button>
        <el-table
          :data="tableData.filter(data => !input3 || data.statusStr.toLowerCase().includes(input3.toLowerCase()))"
          height="600"
          border
          style="width: 100%">
          <el-table-column
              type="index"
              label="#">
          </el-table-column>
          <el-table-column
              label="课程名称"
              prop="statusStr">
          </el-table-column>
          <el-table-column
              label="任课教师ID"
              prop="statusStr">
          </el-table-column>
          <el-table-column
              label="上课班级"
              prop="statusStr">
          </el-table-column>
          <el-table-column
              label="上课人数"
              prop="statusStr">
           </el-table-column>
           <el-table-column
              label="上课周数"
              prop="statusStr">
           </el-table-column>
           <el-table-column
              label="周几上课"
              prop="statusStr">
           </el-table-column>
           <el-table-column
              label="时间段"
              prop="statusStr">
           </el-table-column>
           <el-table-column
              label="教室类型"
              prop="statusStr">
           </el-table-column>
        </el-table>
        <el-pagination
          layout="total"
          :total="this.tableData.length">
        </el-pagination>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  data () {
    return {
      tableData: [],
      tableData1: [],
      input3: '',
      searchvalue: ''
    }
  },
  async created () {
    await this.$http.get(
      '/arrange/findAll',
      { 'Content-Type': 'multipart/form-data' }
    ).then(res => {
      if (res.data.code === 200) {
        this.tableData = res.data.datas.AllArrange
      }
    })
  },
  methods: {
    searcheven () {
      this.input3 = this.searchvalue
    }
  }
}
</script>
<style lang="less" scoped>
.input-with-select{
  width: 20%;
}
.addbutton{
  width: 100%;
  height: 40px;
}
.el-table{
  margin-bottom: 50px;
}
.el-pagination{
  position: relative;
  top: 5px;
}
.el-icon-delete{
  color: red;
}
.el-icon-edit{
  color: blue;
}
.el-select.select1{
  width: 100%;
}
.el-select.select3{
  width: 100%;
}
.el-select.select4{
  width: 100%;
}
.el-select.select2{
  width: 100%;
}
.text2.el-cascader{
  width: 100%;
}
</style>
